.common-btn {
  font-size: 12px !important;
}

$bg: #f3f6ff;
$bg-white: #fff;
$textColor: #164cff;
$texWhiteColor: #fff;

.basic-button-group {
  .el-button {
    @apply w-[60px] h-[32px];
  }

  .el-button:not(:last-child) {
    border-right-color: inherit;
    margin-right: -1px;
  }

  .el-button:not(:first-child) {
    margin-left: 0;
    border-left-color: inherit;
  }

  .el-button.el-button--primary {
    z-index: 1;
    background: $bg;
    color: $textColor;

    &:focus {
      background: $bg !important;
      color: $textColor;
    }
  }

  .el-button:hover {
    background: $bg;
    color: $textColor;
    border-color: inherit;
  }
}

.primary-btn {
  color: $textColor;
  border: 1px solid $textColor !important;
}

.primary-btn:hover {
  background: $bg;
  color: $textColor;
  border-color: inherit;
}

.el-button {
  font-size: 12px;
  height: 30px;
  padding: 6px 12px;

  &.el-button--primary {
    @apply border-none;
  }
}

// 全局primary按钮点击后颜色保持原样
.el-button--primary {
  z-index: 1;
  background: $textColor;
  color: $texWhiteColor;

  &:focus {
    background: $textColor;
    color: $texWhiteColor;
  }
}

.el-button--primary.is-plain {
  background: #fff;
  color: $textColor;
  border: 1px solid $textColor;

  &:hover {
    color: $textColor;
  }

  &:focus {
    color: $textColor;
  }
}

// 今日昨日 按钮组
.basic-date-group {
  @apply bg-[#F7F8FA] flex items-center rounded-[4px] px-[2px];

  .group-item {
    @apply py-[6px] px-[16px] min-w-[60px] h-[32px] leading-[22px] rounded-[4px] text-[#2D2E33] text-[12px] cursor-pointer;
  }

  .active-group_item {
    @apply bg-white text-primary font-semibold;

    box-shadow: 0 0 6px 0 rgba(22, 76, 255, 0.2);
  }
}

.el-button {
  --el-font-size-base: 12px;
}
